import { useTranslation } from 'react-i18next';
import { useNavigate } from 'react-router-dom';
import BackButton from 'src/component/BackButton';
import { Page } from 'src/constant/Page';
import IcContact from 'src/image/ic-support-contact.svg';
import IcPrivacypolicy from 'src/image/ic-support-privacypolicy.svg';
import IcTermofuse from 'src/image/ic-support-termofuse.svg';
import style from './Support.module.scss';

const Support = () => {
  const { t } = useTranslation();
  const navigate = useNavigate();

  return (
    <div>
      <BackButton />
      <div className={style.head}>支援</div>
      <div className={style.content}>
        <div onClick={() => navigate(Page.ContactUs)}>
          <img src={IcContact} />
          <div className={style.title}>联络我们</div>
        </div>
        <div onClick={() => navigate(Page.TermsOfUse)}>
          <img src={IcTermofuse} />
          <div className={style.title}>使用者条款</div>
        </div>
        <div onClick={() => navigate(Page.Privacy)}>
          <img src={IcPrivacypolicy} />
          <div className={style.title}>隐私权政策</div>
        </div>
      </div>
    </div>
  );
};

export default Support;
